<template>
  <div>{{ fullname }}</div>
</template>

<script>
import { reactive,computed } from 'vue'

  export default {
    setup() {
      const names = reactive({
        firstname: "sun",
        lastname: "yu"
      })
      const fullname = computed(()=> {
        return names.firstname + " " + names.lastname
      })
      return {
        fullname
      }
    }
  }
</script>

<style scoped>
</style>